<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ include file="/common/taglibs.jsp"%>
<script type="text/javascript">

$('#userListOzTree').combotree({
	url : '${ctx}/oz/tree.do',
	parentField : 'pid',
	lines : true,
	panelHeight : 460,
    panelWidth: 440,
	value : '${oz.pid}',
	onLoadSuccess : function() {
		$.messager.progress('close');
	}
});

$('#userAddOzTree').combotree({
	url : '${ctx}/oz/tree.do',
	parentField : 'pid',
	lines : true,
	panelHeight : 400,
    panelWidth:230,
	value : '${oz.pid}',
	required:true,
	onLoadSuccess : function() {
		$.messager.progress('close');
	}
});

var dataGrid;
$(function(){
	parent.$.messager.progress('close');
	parent.$.messager.progress({
		title : '提示',
		text : '数据处理中，请稍后....'
	});
	dataGrid = $("#user_datagrid_list").datagrid({
		url : '${ctx}/user/user_datagridlist.do',
		pagination : true,
		fit : true,
		border : true,
		idField : 'id',
		pageSize : 15,
		rownumbers : true,
		pageList : [ 15, 20, 30, 50, 100 ],
		sortName : 'username',
		sortOrder : 'desc',
		singleSelect : true,
		columns : [ [ {
			field  : 'id',
			hidden : true
		}, {
			field : 'username',
			title : '账号',
		}, {
			field : 'name',
			title : '姓名',
		}, {
			field : 'sex',
			hidden:true
		}, {
            field : 'tel',
            title : '座机电话',
        }, {
            field : 'mobile',
            title : '手机电话',
        }, {
			field : 'otext',
			title : '所属部门',
			align : 'right'
		}, {
			field : 'oid',
			hidden:true
		},
		{
			field : 'status',
			hidden:true
		},
		{
			field : 'pinyin',
			title : '拼音码',
			hidden:true
		},
		{
			field : 'rolename',
			title : '拥有角色',
			hidden:true
		}] ],
		toolbar : [ {
			text : '添加',
			iconCls : 'icon-add',
			handler : function() {
				$("#useradd_dialog").dialog('open');
				$("#useradd_Form input").val('');
				$("#useradd_Form img").attr('src','');
			}
		}, '-', {
			text : '编辑',
			iconCls : 'icon-edit',
			handler : function() {
				edit();
			}
		}, '-', {
			text : '删除',
			iconCls : 'icon-remove',
			handler : function() {
				remove();
			}
		} , '-', {
			text : '角色配置',
			iconCls : 'icon-remove',
			handler : function() {
				role_config1();
			}
		} ]
	});
});
	function searchFun() {
		$("#user_datagrid_list").datagrid('load',
				$.serializeObject($('#searchForm')));
	}

	function cleanFun() {
		$("#searchForm input").val('');
		$("#user_datagrid_list").datagrid('load', {});
	}
	
	function edit(){
		var datagrid = $("#user_datagrid_list");
		var rows = datagrid.datagrid('getChecked');
		var ids = "";
		id = rows[0].id;
		if(rows.length == 0){
			$.messager.show({
				title:'提示',
				msg:'请您选择一条数据来做编辑操作！'
			});
		}
		if(rows.length > 1){
			$.messager.show({
				title:'提示',
				msg:'只能选择一条数据来做编辑操作！'
			});
		}
		if(rows.length == 1){
			var dynamic_dialog  = $("<div/>").dialog({
			    title: '用户编辑',
			    width: 750,
			    height: 500,
			    closed: false,
			    cache: false,
			    resizable : true,
			    href: '${ctx}/user/editTo.do?id=' +id,
			    modal: true,
			    buttons:[{
					text : '编辑',
					iconCls: 'icon-add',
					handler : function() {
						$.serializeObject($('#userEdit_edit_form'));
						$('#userEdit_edit_form').form('submit',{
							url:'${ctx}/user/edit.do',
							onSubmit:function(){
								return $('#userEdit_edit_form').form('validate')
							},
							success:function(data){
								var obj = $.parseJSON(data);
								if(obj.success){
									dynamic_dialog.dialog('close');
									datagrid.datagrid('updateRow',{
										index: datagrid.datagrid('getRowIndex',rows[0]),	// index start with 0,在第一行插入数据
										row: obj.obj
									});
								}
								$.messager.show({
									title:'提示',
									msg:obj.msg
								});
							}
						});
					}
				} ],
				onClose:function(){
					$(this).dialog('destroy');
				},
				onLoad:function(){
                    console.log(rows[0]);
					$("#userEdit_edit_form").form('load',rows[0]);
				}
			    
			});
		}
	}

	function remove() {
		var datagrid1 = $("#user_datagrid_list");
		var rows = datagrid1.datagrid('getChecked');
		var ids = [];
		if(rows.length > 0){
			$.messager.confirm('确认','确认要删除吗？',function(r){
			    if (r){
			    	for(var i=0;i<rows.length;i++){
						ids.push(rows[i].id);
					}
					$.ajax({
						url:'${ctx}/user/del.do',
						data:{
							ids:ids.join(',')
						},
						dataType:'json',
						success:function(data){
							datagrid1.datagrid('load');
							datagrid1.datagrid('unselectAll');//使全部的行形成未選中狀態
							$.messager.show({
								title:'提示',
								msg:data.msg
							});
						}
					});
			    }
			});
		}else{
			$.messager.show({
				title:'提示',
				msg:'请至少选择一行来做删除操作！'
			});
		}
	}
	
	
	
	function role_config1(){
		var datagrid = $("#user_datagrid_list");
		var rows = datagrid.datagrid('getChecked');
		var ids = [];
		for(var i=0;i<rows.length;i++){
			ids.push(rows[i].id);
		}
			if(rows.length > 0){
				parent.$.modalDialog({
				    title: '用户角色配置',
				    width: 550,
				    height: 500,
				    closed: false,
				    cache: false,
				    resizable : true,
		    		href: '${ctx}/user/roleTreePage.do?id='+ids,
				    modal: true,
				    buttons:[{
						text : '设置',
						iconCls: 'icon-add',
						handler : function() {
							parent.$.modalDialog.openner_dataGrid = datagrid;//因为添加成功之后，需要刷新这个datagrid，所以先预定义好
							var f = parent.$.modalDialog.handler.find('#form');
							f.submit();
						}
					} ]
				});
		}else{
			$.messager.show({
				title:'提示',
				msg:'请至少选择一行来做资源配置操作！'
			});
		}
	}
	
	$(function() {
		$(":button").click(function() {
			if ($("#file1").val().length > 0) {
				ajaxFileUpload();
			} else {
				alert("请选择图片");
			}
		});
	});
	function ajaxFileUpload() {
		$.ajaxFileUpload({
			url : '${ctx}/tempimg', //用于文件上传的服务器端请求地址
			secureuri : false, //一般设置为false
			fileElementId : 'file1', //文件上传空间的id属性  <input type="file" id="file" name="file" />
			type : 'post',
			dataType : 'HTML', //返回值类型 一般设置为json
			success  : function(data, status) //服务器成功响应处理函数
			{
				$("#img1").attr("src", data);
				$("#path").attr("value",data);
				if (typeof (data.error) != 'undefined') {
					if (data.error != '') {
						alert(data.error);
					} else {
						alert(data.msg);
					}
				}
			},
			error : function(data, status, e)//服务器响应失败处理函数
			{
				alert(e);
			}
		})
		return false;
	}

    function isUserNameExist(){
        var q = $("#username").val();
        $.ajax({
            url:'${ctx}/user/isUserNameExist.do',
            data:{
                q:q
            },
            dataType:'json',
            success:function(data){
                if(!data.success) {
                    $.messager.show({
                        title: '提示',
                        msg: data.msg
                    });
                    $("#username").focus();
                	$("#username").val('');
                }
                
            }
        });
    }
</script>

<div class="easyui-layout" data-options="fit : true,border : false">
	<div data-options="region:'north',title:'条件筛选区',border:false" style="height:70px;overflow:hidden;">
		<form id="searchForm">
			<table>
				<tr>
					<th>账号</th>
					<td><input name="name" placeholder="可以模糊查询姓名" class="easyui-textbox" style="height: 30px;"/></td>
					<th>所属部门</th>
					<td><input name="oid" id="userListOzTree" style="height: 32px;width: 500px;" /></td>
					<td><a href="javascript:void(0);" class="easyui-linkbutton"
						data-options="iconCls:'icon-search',plain:true"
						onclick="searchFun();">开始查询</a> <a href="javascript:void(0);"
						class="easyui-linkbutton"
						data-options="iconCls:'icon-cancel',plain:true"
						onclick="cleanFun();">重置查询</a></td>
				</tr>
			</table>
		</form>
	</div>
	<div data-options="region:'center',border:false">
		<table id="user_datagrid_list"></table>
	</div>
</div>
<div id="useradd_dialog" class="easyui-dialog"
	style="width: 1020px;height:260px;"
	data-options="closed:true,modal:true,resizable : true,title:'添加用户',buttons:[{
				text : '添加',
				iconCls: 'icon-add',
				handler : function() {
					$.serializeObject($('#useradd_Form'));
					$('#useradd_Form').form('submit',{
						url:'${ctx}/user/save.do',
						onSubmit:function(){
							return $('#useradd_Form').form('validate')
						},
						success:function(data){
							var obj = $.parseJSON(data);
							if(obj.success){
								$('#user_datagrid_list').datagrid('load');//此方法还得发送一次查询的请求效率较低，所以要用下面的方法替代
								$('#useradd_dialog').dialog('close');
							}
							$.messager.show({
								title:'提示',
								msg:obj.msg
							});
						}
					});
				}
			} ]">
	<form id="useradd_Form" method="post">
                <div class="info-panel">
                    <div class="panel" style="display: block;">
                        <%--<div class="panel-header" style="width: 988px;">--%>
                            <%--<div class="panel-title"></div>--%>
                            <%--<div class="panel-tool"></div>--%>
                        <%--</div>--%>
                        <table  title="" class="easyui-panel panel-body">
                            <tbody>
                                <tr>
                                    <td>账号:</td>
                                    <td><input style="width:180px;height:29px;" name="username" id="username" type="text" placeholder="请输入用户名" class="easyui-validatebox" data-options="required:true" onblur="isUserNameExist()"></td>
                                    <td>姓名:</td>
                                    <td><input style="width:180px;height:29px;" name="name"     id="name"     type="text" class="easyui-validatebox" required="true" value=""></td>
                                </tr>
                                <tr>
                                    <td>性别:</td>
                                    <td>
                                        <select name="sex" class="easyui-combobox" data-options="width:190,height:29,editable:false,panelHeight:'auto'">
                                            <option selected="selected" value="男">男</option>
                                            <option value="女">女</option>
                                        </select>
                                    </td>
                                    <td>所属部门:</td>
                                    <td><input name="oid"    id="userAddOzTree" type="text" class="easyui-validatebox" data-options="width:190,height:29"></td>
                                </tr>
                                <tr>
                                    <td>手机：</td>
                                    <td>
                                        <input name="mobile"  type="text" placeholder="请输入手机机电话号码"
                                               class="easyui-validatebox"
                                               data-options="validType:'phoneOrMobile'" maxlength="11"
                                               style="width: 180px;height:29px;">
                                    </td>
                                    <td>座机：</td>
                                    <td>
                                        <input name="tel"  type="text" placeholder="请输入座机电话号码"
                                               class="easyui-validatebox" style="width: 180px;height:29px;"
                                               data-options="validType:'phoneOrMobile'">
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
			
			<fieldset>
				<legend><font style="color: red;">温馨提示：新添加的用户初始化密码为123456789。</font></legend>
			</fieldset>
	</form>
</div>

